{% extends "base.html" %}
{% load static %}
{% block etaf_body %}

<div class="etaf_body">
<div class="container">
<div class="row clearfix">
<div class="col-md-3 column " id="etaf_pan_left">
    <div class="etaf_pan">
        <div class="etaf_profile">
            <img src="{% static 'weiAA_app/img/profile.png'%}" class="img-responsive img-thumbnail"
                 alt="Responsive image">
        </div>
        <div class="etaf_remind_text">
            <br/>

            <div class="list-group">
                <a href="#" class="list-group-item etaf_list-group-item"> 待收费活动：<span class="badge">1</span></a>
                <a href="#" class="list-group-item etaf_list-group-item"> 未缴费活动：<span class="badge">1</span></a>
                <a href="#" class="list-group-item etaf_list-group-item"> 未缴费活动：<span class="badge">2</span></a>
                <a href="#" class="list-group-item etaf_list-group-item"> 待投票活动：<span class="badge">3</span></a>
            </div>
        </div>
        <div>
            <button class="btn btn-primary btn-lg btn-block" data-toggle="modal" data-target="#create_modal">
                创 &nbsp;建 &nbsp; 活 &nbsp; 动&nbsp;
            </button>
            <button type="button" class="btn btn-warning btn-lg btn-block " data-toggle="collapse"
                    data-target="#act_level1">
                活&nbsp; 动&nbsp; 列 &nbsp; 表 &nbsp;
            </button>
            <div id="act_level1" class=" collapse" style="padding-top: 3%; padding-right: 10%">
                <button type="button" class="btn btn-danger  btn-block btn_load " data-toggle="collapse">
                    已创建活动
                </button>
                <button type="button" class="btn btn-danger  btn-block " data-toggle="collapse">
                    参与的活动
                </button>
            </div>
        </div>

    </div>
</div>
<div class="col-md-6 column">
<div class="etaf_pan">
<div class="tabbable" id="tabs-565942">
<ul class="nav nav-tabs">
    <li class="active">
        <a href="#panel-tab1" data-toggle="tab"><h4>未确认活动</h4></a>
    </li>
    <li>
        <a href="#panel-tab2" data-toggle="tab"><h4>已确认活动</h4></a>
    </li>
    <li>
        <a href="#panel-tab3" data-toggle="tab"><h4>收费中活动</h4></a>
    </li>
    <li>
        <a href="#panel-tab4" data-toggle="tab"><h4>已结束活动</h4></a>
    </li>
</ul>
<!-- tab - content-->
<div class="tab-content">
<!-- tab1 content -->
<div class="tab-pane active" id="panel-tab1">
<!--  <h3>未确认活动</h3> -->
<br/>

<div class="panel-group" id="accordion">
<!--活动-->
{% for a in unchecked_activity_list %}
<div class="panel panel-default">
	<!-- 活动head -->
	<div class="panel-heading">
        <h4 class="panel-title">
            <a href="#{{a.aid}}" data-toggle="collapse">
                <span class="label label-danger">{{ a.name }}</span>
                <span class="label label-primary">{{a.date|date:"Y-m-d H:i:s"}}</span>
                <span class="label label-success">创建者: {{a.creator_id}}</span>
                <span class="label label-info">活动状态: 未确认</span>
            </a>
        </h4>
	</div>
	<!--  活动body -->
    <div id={{ a.aid }} class="panel-collapse collapse">
		<div class="panel-body">
			{% for plan in a.weiaaactivityplan_set.all %}
			<div>
				<table class="table table-condensed table-hover etaf_td_width_4">
                    <!-- 活动方案 -->
                    <tr>
                        <td colspan="2">
                            方案提出者：{{plan.creator_id}}
                        </td>
                        <td>
                            票数：{{plan.vote}}
                        </td>
                        <td>
                            <button type="button" class="btn btn-success etaf_vote_btn">
                                投票
                            </button>
                        </td>
                    </tr>
                    <tr class="active">
                        <td>开始时间</td>
                        <td>地点</td>
                        <td>内容</td>
                        <td>预计人均</td>
                    </tr>
					{% for item in plan.weiaaactivityplanitem_set.all %}
                    <tr class="success">
                        <td>{{ item.start_time|date:"Y-m-d H:i:s" }}</td>
                        <td>{{ item.place }}</td>
                        <td>{{ item.content }}</td>
                        <td>{{ item.estimate_per_cost }}</td>
                    </tr>
                    {% endfor %}
                    <tr class="active">
                        <td colspan="4">
                            <div class="etaf_momey_line">
                                预计人均：{{plan.estimate_per_cost}} <span class="badge">￥</span>
                            </div>
                        </td>
                    </tr>
            </table>
			<hr class="cut_line"/>
			</div>
			{% endfor %}
			<!-- 参与者list-->
			<div>
				<h4><span class="label label-primary">参与者名单:</span></h4>
                <table class="table table-condensed table-hover">
                    <tr>
                        <td colspan="2">参与者</td>
                        <td>是否参加</td>
                        <td></td>
                        <td></td>
                    </tr>
					{% for member in a.weiaaactivitymember_set.all %}
                    <tr>
                        <td colspan="2">{{member.uid}}</td>
                        {% if member.is_checkin %}
							<td><span class="label label-success">Yes</span></td>
						{% else %}
							<td><span class="label label-success">No</span></td>
                        {% endif %}
                        <td>
                            <button class="btn btn-info etaf_remind_btn" disabled>
                                提醒
                            </button>
                        </td>
                        <td>
                            <button class="btn btn-danger etaf_remind_btn" disabled>
                                删除
                            </button>
                        </td>
                    </tr>
					{% endfor %}
                </table>
			</div>
			<!-- 确认活动 -->
			<div>
				<a data-trigger="confirm" href="#" class="btn btn-primary btn-lg btn-block">添加新方案</a>
			</div>
            <!-- 新方案 -->
			<div>
                <a data-trigger="confirm" href="#" class="btn btn-danger btn-lg btn-block">确认</a>
			</div>
		</div>
	</div>
</div>
{% endfor %}
</div>
</div>
<!-- tab2 content -->
<div class="tab-pane" id="panel-tab2">
<!--  <h3>已确认活动</h3> -->
<br/>

<div class="panel-group" id="accordion">
<!--活动-->
{% for a in checked_activity_list %}
<div class="panel panel-default">
	<!-- 活动head -->
	<div class="panel-heading">
        <h4 class="panel-title">
            <a href="#{{ a.aid }}" data-toggle="collapse">
                <span class="label label-danger">{{ a.name }}</span>
                <span class="label label-primary">{{a.date|date:"Y-m-d H:i:s"}}</span>
                <span class="label label-success">创建者: {{a.creator_id}}</span>
                <span class="label label-info">活动状态: 已确认</span>
            </a>
        </h4>
	</div>
	<!--  活动body -->
    <div id="{{ a.aid }}" class="panel-collapse collapse">
		<div class="panel-body">
			{% for plan in a.weiaaactivityplan_set.all %}
			<div>
				<table class="table table-condensed table-hover etaf_td_width_4">
                    <!-- 活动方案 -->
                    <tr>
                        <td colspan="2">
                            方案提出者：{{plan.creator_id}}
                        </td>
                        <td>
                            票数：{{plan.vote}}
                        </td>
                        <td>
                            <button type="button" class="btn btn-success etaf_vote_btn">
                                投票
                            </button>
                        </td>
                    </tr>
                    <tr class="active">
                        <td>开始时间</td>
                        <td>地点</td>
                        <td>内容</td>
                        <td>预计人均</td>
                    </tr>
					{% for item in plan.weiaaactivityplanitem_set.all %}
                    <tr class="success">
                        <td>{{ item.start_time|date:"Y-m-d H:i:s" }}</td>
                        <td>{{ item.place }}</td>
                        <td>{{ item.content }}</td>
                        <td>{{ item.estimate_per_cost }}</td>
                    </tr>
                    {% endfor %}
                    <tr class="active">
                        <td colspan="4">
                            <div class="etaf_momey_line">
                                预计人均：{{plan.estimate_per_cost}} <span class="badge">￥</span>
                            </div>
                        </td>
                    </tr>
            </table>
			<hr class="cut_line"/>
			</div>
			{% endfor %}
			<!-- 参与者list-->
			<div>
				<h4><span class="label label-primary">参与者名单:</span></h4>
                <table class="table table-condensed table-hover">
                    <tr>
                        <td colspan="2">参与者</td>
                        <td>是否参加</td>
                        <td></td>
                        <td></td>
                    </tr>
					{% for member in a.weiaaactivitymember_set.all %}
                    <tr>
                        <td colspan="2">{{member.uid}}</td>
						{% if member.is_checkin %}
							<td><span class="label label-success">Yes</span></td>
						{% else %}
							<td><span class="label label-success">No</span></td>
                        {% endif %}
						<td>
                            <button class="btn btn-info etaf_remind_btn" disabled>
                                提醒
                            </button>
                        </td>
                        <td>
                            <button class="btn btn-danger etaf_remind_btn" disabled>
                                删除
                            </button>
                        </td>
                    </tr>
					{% endfor %}
                </table>
			</div>
			<!-- 确认活动 -->
			<div>
				<a data-trigger="confirm" href="#" class="btn btn-primary btn-lg btn-block">添加新方案</a>
			</div>
            <!-- 新方案 -->
			<div>
                <a data-trigger="confirm" href="#" class="btn btn-danger btn-lg btn-block">确认</a>
			</div>
		</div>
	</div>
</div>
{% endfor %}
</div>
</div>
<!-- tab3 content -->
<div class="tab-pane" id="panel-tab3">
<!--  <h3>收费中活动</h3> -->
<br/>

<div class="panel-group" id="accordion">
<!--活动-->
{% for a in feeing_activity_list %}
<div class="panel panel-default">
	<!-- 活动head -->
	<div class="panel-heading">
        <h4 class="panel-title">
            <a href="#{{ a.aid }}" data-toggle="collapse">
                <span class="label label-danger">{{ a.name }}</span>
                <span class="label label-primary">{{a.date|date:"Y-m-d H:i:s"}}</span>
                <span class="label label-success">创建者: {{a.creator_id}}</span>
                <span class="label label-info">活动状态: 收费中活动</span>
            </a>
        </h4>
	</div>
	<!--  活动body -->
    <div id="{{ a.aid }}" class="panel-collapse collapse">
		<div class="panel-body">
			{% for plan in a.weiaaactivityplan_set.all %}
			<div>
				<table class="table table-condensed table-hover etaf_td_width_4">
                    <!-- 活动方案 -->
                    <tr>
                        <td colspan="2">
                            方案提出者：{{plan.creator_id}}
                        </td>
                        <td>
                            票数：{{plan.vote}}
                        </td>
                        <td>
                            <button type="button" class="btn btn-success etaf_vote_btn">
                                投票
                            </button>
                        </td>
                    </tr>
                    <tr class="active">
                        <td>开始时间</td>
                        <td>地点</td>
                        <td>内容</td>
                        <td>预计人均</td>
                    </tr>
					{% for item in plan.weiaaactivityplanitem_set.all %}
                    <tr class="success">
                        <td>{{ item.start_time|date:"Y-m-d H:i:s" }}</td>
                        <td>{{ item.place }}</td>
                        <td>{{ item.content }}</td>
                        <td>{{ item.estimate_per_cost }}</td>
                    </tr>
                    {% endfor %}
                    <tr class="active">
                        <td colspan="4">
                            <div class="etaf_momey_line">
                                预计人均：{{plan.estimate_per_cost}} <span class="badge">￥</span>
                            </div>
                        </td>
                    </tr>
            </table>
			<hr class="cut_line"/>
			</div>
			{% endfor %}
			<!-- 参与者list-->
			<div>
				<h4><span class="label label-primary">参与者名单:</span></h4>
                <table class="table table-condensed table-hover">
                    <tr>
                        <td colspan="2">参与者</td>
                        <td>是否参加</td>
                        <td></td>
                        <td></td>
                    </tr>
					{% for member in a.weiaaactivitymember_set.all %}
                    <tr>
                        <td colspan="2">{{member.uid}}</td>
                        <td><span class="label label-success">Yes</span></td>
                        <td>
                            <button class="btn btn-info etaf_remind_btn" disabled>
                                提醒
                            </button>
                        </td>
                        <td>
                            <button class="btn btn-danger etaf_remind_btn" disabled>
                                删除
                            </button>
                        </td>
                    </tr>
					{% endfor %}
                </table>
			</div>
			<!-- 确认活动 -->
			<div>
				<a data-trigger="confirm" href="#" class="btn btn-primary btn-lg btn-block">添加新方案</a>
			</div>
            <!-- 新方案 -->
			<div>
                <a data-trigger="confirm" href="#" class="btn btn-danger btn-lg btn-block">确认</a>
			</div>
		</div>
	</div>
</div>
{% endfor %}
</div>
</div>

<!-- tab4 content -->
<div class="tab-pane" id="panel-tab4">
<!--  <h3>已结束活动</h3> -->
<br/>

<div class="panel-group" id="accordion">
<!--活动-->
{% for a in finished_activity_list %}
<div class="panel panel-default">
	<!-- 活动head -->
	<div class="panel-heading">
        <h4 class="panel-title">
            <a href="#{{ a.aid }}" data-toggle="collapse">
                <span class="label label-danger">{{ a.name }}</span>
                <span class="label label-primary">{{a.date|date:"Y-m-d H:i:s"}}</span>
                <span class="label label-success">创建者: {{a.creator_id}}</span>
                <span class="label label-info">活动状态: 已结束</span>
            </a>
        </h4>
	</div>
	<!--  活动body -->
    <div id="{{ a.aid }}" class="panel-collapse collapse">
		<div class="panel-body">
			{% for plan in a.weiaaactivityplan_set.all %}
			<div>
				<table class="table table-condensed table-hover etaf_td_width_4">
                    <!-- 活动方案 -->
                    <tr>
                        <td colspan="2">
                            方案提出者：{{plan.creator_id}}
                        </td>
                        <td>
                            票数：{{plan.vote}}
                        </td>
                        <td>
                            <button type="button" class="btn btn-success etaf_vote_btn">
                                投票
                            </button>
                        </td>
                    </tr>
                    <tr class="active">
                        <td>开始时间</td>
                        <td>地点</td>
                        <td>内容</td>
                        <td>预计人均</td>
                    </tr>
					{% for item in plan.weiaaactivityplanitem_set.all %}
                    <tr class="success">
                        <td>{{ item.start_time|date:"Y-m-d H:i:s" }}</td>
                        <td>{{ item.place }}</td>
                        <td>{{ item.content }}</td>
                        <td>{{ item.estimate_per_cost }}</td>
                    </tr>
                    {% endfor %}
                    <tr class="active">
                        <td colspan="4">
                            <div class="etaf_momey_line">
                                预计人均：{{plan.estimate_per_cost}} <span class="badge">￥</span>
                            </div>
                        </td>
                    </tr>
            </table>
			<hr class="cut_line"/>
			</div>
			{% endfor %}
			<!-- 参与者list-->
			<div>
				<h4><span class="label label-primary">参与者名单:</span></h4>
                <table class="table table-condensed table-hover">
                    <tr>
                        <td colspan="2">参与者</td>
                        <td>是否参加</td>
                        <td></td>
                        <td></td>
                    </tr>
					{% for member in a.weiaaactivitymember_set.all %}
                    <tr>
                        <td colspan="2">{{member.uid}}</td>
                        <td><span class="label label-success">Yes</span></td>
                        <td>
                            <button class="btn btn-info etaf_remind_btn" disabled>
                                提醒
                            </button>
                        </td>
                        <td>
                            <button class="btn btn-danger etaf_remind_btn" disabled>
                                删除
                            </button>
                        </td>
                    </tr>
					{% endfor %}
                </table>
			</div>
			<!-- 确认活动 -->
			<div>
				<a data-trigger="confirm" href="#" class="btn btn-primary btn-lg btn-block">添加新方案</a>
			</div>
            <!-- 新方案 -->
			<div>
                <a data-trigger="confirm" href="#" class="btn btn-danger btn-lg btn-block">确认</a>
			</div>
		</div>
	</div>
</div>
{% endfor %}
</div>
</div>

</div>
</div>

</div>

</div>

<div class="col-md-3 column ">
    <div class="etaf_pan">

    </div>
</div>
</div>
</div>
</div>

<!-- create activities  -->
<div class="modal fade" id="create_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">创建活动</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" role="form">
                    <!--活动id-->
                    <div class="form-group">
                        <div>

                            <label for="activityID" class="col-sm-2 control-label">活动 id </label>

                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="activityID" placeholder="acivity 1"
                                       readonly>
                            </div>
                        </div>
                    </div>
                    <br/>
                    <!--活动方案-->
                    <div>
                        <h4>活动项</h4>

                        <div>
                            <div class="form-group">

                                <label for="act_time" class="col-md-2 control-label">活动时间</label>

                                <div class="col-sm-10 input-group date form_datetime" data-link-field="act_time">
                                    <input class="form-control" id="act_time" size="16" type="text" value="" readonly>
                                    <span class="input-group-addon"><span
                                            class="glyphicon glyphicon-remove"></span></span>
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="act_address" class="col-sm-2 control-label">活动地点</label>

                                <div class="col-sm-10">
                                    <input type="text" class="form-control" id="act_address">
                                </div>

                            </div>
                            <div class="form-group">
                                <label for="act_content" class="col-sm-2 control-label">活动内容</label>

                                <div class="col-sm-10">
                                    <textarea class="form-control" id="act_content" rows="3"></textarea>
                                </div>

                            </div>

                        </div>
                    </div>
                    <!--参与者名单-->
                    <div>
                        <h4>参与者名单及邀请，利用weibo平台提供的好友选择器组件，待开发...</h4>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary">Save</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<script type="text/javascript">
    $('.form_datetime').datetimepicker({
        // language:  'zh-CN',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1,
        format: "yyyy-mm-dd hh:ii"
    });
</script>
{% endblock %}